<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="../css/Pet.css">

    <link rel="stylesheet" href="../css/banner.css">
    <link rel="stylesheet" href="../iconfont/iconfont.css">
    <link rel="stylesheet" href="../css/footer.css">
</head>

<body>
    <nav class="xtxNav">
        <div class="xtxLogin w">
            <ul>
                <li><a href="#">请先登录</a></li>
                <li><a href="#">免费注册</a></li>
                <li><a href="#">我的订单</a></li>
                <li><a href="#">会员中心</a></li>
                <li><a href="#">帮助中心</a></li>
                <li><a href="#">关注我们</a></li>
                <li><i class="iconfont icon-shouji"></i> <a href="#">手机版</a></li>
            </ul>
        </div>
    </nav>
    <!-- 首页 -->
    <div class="xtxHomepage w">
        <div class="page">
            <div class="topLogo">
                <h1>
                    <a href="#"><img src="../image/logo.png" alt=""></a>
                </h1>
            </div>
            <div>
                <ul>
                    <li><a href="#" class="active">首页</a></li>
                    <li>
                        <a href="#">居家</a>
                    </li>
                    <li><a href="#">美食</a></li>
                    <li><a href="#">服饰</a></li>
                    <li><a href="#">母婴</a></li>
                    <li><a href="#">个护</a></li>
                    <li><a href="#">严选</a></li>
                    <li><a href="#">数码</a></li>
                    <li><a href="#">运动</a></li>
                    <li><a href="#">杂项</a></li>
                </ul>
            </div>
            <div class="disabled">
                <div class="shoppingTop">
                    <div class="search">
                        <i class="iconfont icon-RectangleCopy"></i>
                        <input type="text" placeholder="搜一搜">

                    </div>
                    <div class="font">
                        <a href="#" class="goods-inconfont">
                            <i class="iconfont icon-gouwuchekong"></i>
                            <em>3</em>
                        </a>
                    </div>
                </div>
                <div class="box">
                    <div class="triangle"></div>
                    <div class="list">
                        <div class="item">
                            <a href="#">
                                <img src="https://yanxuan-item.nosdn.127.net/4356c9fc150753775fe56b465314f1eb.png"
                                    alt="">
                                <div class="center">
                                    <p class="name">大师监制龙泉青瓷茶叶罐</p>
                                    <p class="attr">规格:中号</p>
                                </div>
                                <div class="right">
                                    <p class="price">￥239.00</p>
                                    <p class="count">x1</p>
                                </div>
                            </a>
                            <i class="iconfont icon-chahao"></i>
                        </div>
                        <div class="item">
                            <a href="#">
                                <img src="https://yanxuan-item.nosdn.127.net/c09706c1e85dd2f5c9886b4f3e0cbbf0.png"
                                    alt="">
                                <div class="center">
                                    <p class="name">让全家人喝上甜甜的水黑科技镁离子净水壶</p>
                                    <p class="attr">颜色:【半年版-白色】1壶9芯（适用6~9个月）</p>
                                </div>
                                <div class="right">
                                    <p class="price">¥448.00</p>
                                    <p class="count">x1</p>
                                </div>
                            </a>
                            <i class="iconfont icon-chahao"></i>
                        </div>
                        <div class="item">
                            <a href="#">
                                <img src="https://yanxuan-item.nosdn.127.net/9208f2df07d79dd39fb9f5eaf9ca95c6.png"
                                    alt="">
                                <div class="center">
                                    <p class="name">匠心手工羊脂玉白茶具礼盒6件套</p>
                                    <p class="attr">规格:1*壶；1*公道杯；4*品茗杯</p>
                                </div>
                                <div class="right">
                                    <p class="price">￥339.00</p>
                                    <p class="count">x1</p>
                                </div>
                            </a>
                            <i class="iconfont icon-chahao"></i>
                        </div>
                    </div>
                    <div class="foot">
                        <div class="total">
                            <p class="goodsTotal">共3件商品</p>
                            <p class="price">￥1026</p>
                        </div>
                        <button>去购物车结算</button>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- 隐藏首页 -->
    <div class="xtxPage">
        <div class="xthShow w">
            <div>
                <h1>
                    <a href="#"><img src="../image/logo.png" alt=""></a>
                </h1>
            </div>
            <ul>
                <li><a href="#" class="active">首页</a></li>
                <li><a href="#">居家</a></li>
                <li><a href="#">美食</a></li>
                <li><a href="#">服饰</a></li>
                <li><a href="#">母婴</a></li>
                <li><a href="#">个护</a></li>
                <li><a href="#">严选</a></li>
                <li><a href="#">数码</a></li>
                <li><a href="#">运动</a></li>
                <li><a href="#">杂项</a></li>
            </ul>
            <div class="right">
                <a href="#">品牌</a>
                <a href="#">专题</a>
            </div>
        </div>
    </div>
    <div class="top ">
        <ul class="mainTop w">
            <li>首页</li>
            <li><i class="iconfont icon-youjiantou
                "></i></li>
            <li>居家</li>
            <li><i class="iconfont icon-youjiantou"></i></li>
            <li>室外拖鞋</li>
        </ul>
    </div>
    <div class="shootDatils w">
        <div class="shootBrand ">
            <div class="brand-title">品牌</div>
            <div class="custom-made">
                <ul>
                    <li><a href="">全部</a></li>
                    <li><a href="">汉服定制</a></li>
                </ul>
            </div>
        </div>
        <div class="shoot-color">
            <div class="color-title">颜色</div>
            <div class="color-classify">
                <ul>
                    <li><a href="#">全部</a></li>
                    <li><a href="#">蓝色</a></li>
                    <li><a href="#">粉色</a></li>
                    <li><a href="#">西瓜红</a></li>
                    <li><a href="#">柔光白</a></li>
                    <li><a href="#">沙金色</a></li>
                    <li><a href="#">黑武士</a></li>
                    <li><a href="#">藏青色</a></li>
                    <li><a href="#">粉色-通话</a></li>
                    <li><a href="#">浪漫粉</a></li>
                    <li><a href="#">中灰色</a></li>
                    <li><a href="#">浅蓝色</a></li>
                    <li><a href="#">黑/白色</a></li>
                    <li><a href="#">西瓜红</a></li>
                    <li><a href="#">藏青色</a></li>
                    <li><a href="#">粉色-通话</a></li>
                    <li><a href="#">中灰色</a></li>
                    <li><a href="#">米白色</a></li>
                </ul>
            </div>
        </div>
        <div class="shoot-size">
            <div class="size-title">尺码</div>
            <div class="size-classify">
                <ul>
                    <li><a href="#">全部</a></li>
                    <li><a href="#">男XL(44-45)</a></li>
                    <li><a href="#">男L（42-43）</a></li>
                    <li><a href="#">40（男）</a></li>
                    <li><a href="#">女L(39-40)</a></li>
                    <li><a href="#">37</a></li>
                    <li><a href="#">女L（39-40）</a></li>
                    <li><a href="#">38</a></li>
                    <li><a href="#">40</a></li>
                    <li><a href="#">41</a></li>
                    <li><a href="#">女L(39-40)</a></li>
                    <li><a href="#">40（男）</a></li>
                    <li><a href="#">37</a></li>
                    <li><a href="#">40（男）</a></li>
                    <li><a href="#">女L(39-40)</a></li>
                    <li><a href="#">男XL(44-45)</a></li>
                    <li><a href="#">女L(39-40)</a></li>
                    <li><a href="#">36</a></li>
                </ul>
            </div>
        </div>
    </div>
    <div class="shoot-exhibit w">
        <div class="shoot-sort">
            <div class="sort-left">
                <ul>
                    <li class="lightSort"><a href="#">默认排序</a></li>
                    <li><a href="#">最新商品</a></li>
                    <li><a href="#">最高人气</a></li>
                    <li><a href="#">评论最多</a></li>
                    <li><a href="#">价格排序</a></li>
                </ul>
            </div>
            <div class="sort-right">
                <input type="checkbox"><span>仅显示有货商品</span>
                <input type="checkbox"><span>仅显示特惠商品</span>
            </div>
        </div>
        <div class="goods-exhibit"></div>
    </div>
    <footer class="footer">
        <div class="contact">
            <div class="container w">
                <ul>
                    <li>
                        <p>客户服务</p>
                        <em>
                            <i class="iconfont icon-tubiao-weixin"></i>
                            在线客服
                        </em>
                        <em>
                            <i class="iconfont icon-yiwenwenhaoduihuakuangjiedamianxing"></i>
                            问题反馈
                        </em>
                    </li>
                    <li>
                        <p>关注我们</p>
                        <em>
                            <i class="iconfont icon-weixin1"></i>
                            公众号
                        </em>
                        <em>
                            <i class="iconfont icon-weibo"></i>
                            微博
                        </em>
                    </li>
                    <li>
                        <p>下载APP</p>
                        <em>
                            <img src="http://erabbit.itheima.net/img/qrcode.5372a064.jpg" alt="">
                        </em>
                        <div>
                            <p>扫描二维码</p>
                            <p>立马下载APP</p>
                            <a href="#">下载页面</a>
                        </div>
                    </li>
                    <li>
                        <p>服务热线</p>
                        <div>
                            <p>400-0000-000</p>
                            <p>周一至周日 8:00-18:00</p>
                        </div>
                    </li>
                </ul>
            </div>
        </div>
        <div class="extra">
            <div class="container w">
                <div class="slogan">
                    <a href="#">
                        <span></span>
                        <span>价格亲民</span>
                    </a>
                    <a href="#">
                        <span></span>
                        <span>物流快捷</span>
                    </a>
                    <a href="#">
                        <span></span>
                        <span>品质新鲜</span>
                    </a>
                </div>
                <div class="copyright">
                    <p>
                        <a href="#">关于我们</a>
                        <a href="#">帮助中心</a>
                        <a href="#">售后服务</a>
                        <a href="#">验送与验收</a>
                        <a href="#">商务合作</a>
                        <a href="#">搜索推荐</a>
                        <a href="#">友情链接</a>
                    </p>
                    <p>CopyRight © 小兔鲜儿</p>
                </div>
            </div>
        </div>

    </footer>
    <script src="../js/Pet.js"></script>
    <script src="../js/banner.js"></script>
</body>

</html>